<template>
  <PageWrapper dense contentFullHeight contentClass="flex">
    <Group class="w-1/3" @group-change="handleGroupChange" />
    <Config v-if="!!groupId" class="w-2/3" :groupId="groupId" />
  </PageWrapper>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { PageWrapper } from '/@/components/Page';
import Group from './group.vue';
import Config from './config.vue';

const groupId = ref();

// 分组选中事件
function handleGroupChange(value) {
  groupId.value = value;
}
</script>

<style lang="less">
@prefix-cls: ~'@{namespace}-page-wrapper';

.@{prefix-cls} {
  position: relative;

  .@{prefix-cls}-content {
    margin: 0;
  }
}
</style>